<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="../../../lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="../../../css/public.css" media="all">
    <script src="../../../lib/layui-v2.6.3/layui.js" charset="UTF-8"></script>
    <script src="../../../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
</head>
<body>
<div class="layui-fluid yk-jiezhenc" style="width: 36%;">
    <div class="layui-col-md12">
        <div class="layui-card">
            <div class="layui-card-body">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 65px;padding: 5px 10px;">药品</label>
                            <div class="layui-input-block" style="margin-left: 65px;">
                                <input type="text" id="drugname" class="layui-input" placeholder="请输入药品名">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit="search" id="searchdrug" lay-filter="searcha"><i class="layui-icon layui-icon-search"></i>搜索</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="layui-col-md12">
        <div class="layui-card">
            <div class="layui-card-body">
                <table class="layui-hide" id="Lista" lay-filter="Lista" lay-data="{id: 'Lista'}"></table>
                <script type="text/html" id="acta">
                    <input type="submit" class="layui-btn layui-btn-xs layui-btn-normal">
                </script>
            </div>
        </div>
    </div>
</div>
<div class="layui-fluid yk-jiezhenc" style="width: 28%;">
    <div class="layui-col-md12">
        <div class="layui-card">
            <div class="layui-card-body">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 65px;padding: 5px 10px;">器材</label>
                            <div class="layui-input-block" style="margin-left: 65px;">
                                <input type="text"  id="qicainame" class="layui-input" placeholder="请输入器材名">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit="search" id="searchdrugs" lay-filter="searchb"><i class="layui-icon layui-icon-search"></i>搜索</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="layui-col-md12">
        <div class="layui-card">
            <div class="layui-card-body">
                <table class="layui-hide" id="Listb" lay-filter="Listb" lay-data="{id: 'Listb'}"></table>
                <script type="text/html" id="actb">
                    <input type="submit" class="layui-btn layui-btn-xs layui-btn-normal" "tianjia('{{d.id}}','{{d.pname}}','{{d.price}}')" value="添加">
                </script>
            </div>
        </div>
    </div>
</div>
</body>
<script src="js/layuiList.js"></script>
<script>
    layui.use('table', function(){
        var table = layui.table;
        table.render({
            elem: '#Lista'
            ,url: 'drug_listjz' //数据接口
            ,page: true //开启分页
            ,cols: [[ //表头
                {field: 'pname', title: '药品名称'},
                {field: 'unit', title: '单位',width:'13%'},
                {field: 'price', title: '单价/元',width:'16%'},
                {field: 'snumber', title: '库存',width:'13%'},
                {field: 'right', title: '操作',align:'center',toolbar:'#acta',width:'15%'},
            ]]
        });
        layList.search('searcha',function(where){
            table.reload('Lista', {
                where: { //设定异步数据接口的额外参数，任意设
                    pname: $("#drugname").val().trim(),
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });

        table.render({
            elem: '#Listb'
            ,url: 'drug_listjz' //数据接口
            ,page: true //开启分页
            ,cols: [[ //表头
                {field: 'pname', title: '器材名称'},
                {field: 'unit', title: '单位',width:'17%'},
                {field: 'price', title: '单价/元',width:'22%'},
                {field: 'right', title: '操作',align:'center',toolbar:'#actb',width:'17%'},
            ]]
        });
        layList.search('searchb',function(where){
            table.reload('Listb', {
                where: { //设定异步数据接口的额外参数，任意设
                    pname: $("#qicainame").val().trim(),
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });
    });
</script>
</html>